import { PropType } from "vue";

/** 按钮大小 */
export type ButtonSizeType = "medium" | "small" | "mini";

/** 按钮类型-颜色 */
export type ButtonType =
  | "primary"
  | "success"
  | "warning"
  | "danger"
  | "info"
  | "text";

/** 原生属性 */
export type ButtonHTMLType = "submit" | "button" | "reset";

/** 按钮props */
export const buttonProps = () => ({
  /** 按钮大小 */
  size: String as PropType<ButtonSizeType>,

  /** 按钮状态 */
  type: String as PropType<ButtonType>,

  /** 是否朴素按钮 */
  plain: { type: Boolean, default: false },

  /** 是否圆角按钮 */
  round: { type: Boolean, default: false },

  /** 是否加载中状态 */
  loading: { type: Boolean, default: false },

  /** 是否禁用状态 */
  disabled: { type: Boolean, default: false },

  /** 图标按钮 */
  icon: String,

  /** 原生属性 */
  nativeType: String as PropType<ButtonHTMLType>,

  /** 点击事件 */
  onClick: {
    type: Function as PropType<(event: MouseEvent) => void>,
  },

  /** 当用户按下鼠标按钮执行 */
  onMousedown: {
    type: Function as PropType<(event: MouseEvent) => void>,
  },
});
